<template>
	<div class="press-box">
		<img class="press-banner" src="https://diyapi.5ug.com/wwwroot/uploads/api/935-660-657/2022-12-15/639ae0f1e43c4f06779db5ec.png" />
		<div class="press-conter">
			<ul class="press-head">
				<li class="press-head_li" :class="{'press-head_active': zIndex == 0}" v-for="(zItem,zIndex) in headNavList" :key="zIndex"><span class="press-head_arrows" v-if="zIndex!=0">></span>{{zItem}}</li>
			</ul>
			<div class="press-project">
				<div class="press-menu">
					<div class="press-menu_ul">
						<div class="press-menu_li" @click="menuTab1(nItem)" :class="{'press-menu_active': nItem.url == currentIndex1}" v-for="(nItem,nIndex) in meunList" :key="nIndex">{{nItem.name}}</div>
					</div>
				</div>
				<div class="press-matter">
					<router-view :key="key"></router-view>
				</div>
			</div>
		</div>
	</div>
</template>
<script>
	export default {
		computed: {
			key() {
				return this.$route.path + Math.random()
			}
		},
		data() {
			return {
				meunList: [{
					name: '公司新闻',
					url: '/web/standard/press/list?type=1'
				}, {
					name: '行业咨询',
					url: '/web/standard/press/list?type=2'
				}],
				currentIndex1: '',
				headNavList: []
			}
		},
		mounted() {
			this.init()
			this.$bus.$on('standard_init_change', () => {
				this.init()
			})
		},
		methods: {
			async init() {
				if (!this.$route.query.type) {
					this.currentIndex1 = this.$route.path + '?type=1'
				} else {
					this.currentIndex1 = this.$route.path + '?type=' + this.$route.query.type
				}
				var matchedList = this.$route.matched
				var this_ = this
				this_.headNavList = []
				matchedList.forEach(res => {
					this_.headNavList.push(res.name)
				})
			},
			menuTab1(vData) {
				this.currentIndex1 = vData.url
				this.headNavList[this.headNavList.length - 1] = vData.name
				this.$router.push(vData.url)
			}
		}
	}
</script>
<style lang="scss">
	@import './style.scss';
</style>